<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="com.wframe.project.jnd.util.ServletUtils" %>
<%@ include file="/website/common/base.jsp"%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>微信支付</title>
    <link rel="stylesheet" href="${webctx}/css/payment.css">
    <%@ include file="/website/common/common.jsp"%>
</head>
<style>
    .check-out-head{
        background-color: #fff;
    }
    .check-out-msg{
        width:970px;
        padding:25px 10px 6px 10px;
    }
    .order-num{
        padding-left: 10px;
        font-size:16px;
        color:#333;
        margin-bottom: 5px;
    }
    .order-num span{
        margin-left: 20px;
    }
    .pay-money em{
        color: #ff6767;
    }
    .check-out-con{
        background-color: #fff;
        margin-bottom: 50px;
        height: 400px;
    }
    .check-out-con .yindaotu{
        float: left;
        width:231px;
        height:294px;
        margin-right: 150px;
        margin-left: 175px;
        margin-top: 50px;
    }
    .check-out-con .erweima{
        float: left;
        width:180px;
        height:230px;
        margin-top: 85px;
    }

    .order-btn{
        font-size:16px;
        color:#0daeff;
        padding: 10px 20px;
        background: url("../images/down-ico.png") no-repeat right center;
        cursor:pointer;
    }
    .order-btn.up-ico{
        background: url("../images/up-ico.png") no-repeat right center;
    }
    .order-detail-con{
        display: none;
        padding-left: 10px;
        height:60px;
        font-size:14px;
        color:#666;
        border-top:1px solid #dcdcdc
    }
    .order-detail-con p{
        margin-top: 15px;
    }
    .order-detail-con p span{
        margin-right: 30px;
    }

</style>
<body style="background-color: #f8f8f8;">
<%@ include file="/website/common/top-pay.jsp" %>

<div id="check-out" class="clearfix">
    <div class="check-out-head">
        <div class="head wid990 clearfix">
            <div class="logo"><a href="/website/index.jsp"><img src="/website//images/logo.png"></a></div>
            <div class="head-message">微信支付</div>
        </div>
    </div>
    <div class="check-out-msg wid990 clearfix">
        <div class="order-text-msg fl">
            <p class="order-num">请您及时付款，以便为您及时处理订单。<span>订单编号：156415846189</span></p>
        </div>
        <div class="pay-money fr">
            支付金额：<em>298</em> 元
        </div>
        <div class="clearfix"></div>
        <div class="order-detail">
            <div class="order-btn fr">订单详情</div>
            <div class="clearfix"></div>
            <div class="order-detail-con">
                <p>
                    <span>收货地址：广州市白云区金沙洲环洲二路金程广场311</span>
                    <span>联系人：张三  </span>
                    <span>联系电话：13145816492 </span>
                </p>
                <p>订单商品：999感冒灵，小二牌感冒药，小柴胡感冒冲剂，东阿阿胶补血颗粒，川贝枇杷冲剂，慢严舒柠药...</p>
            </div>
        </div>
    </div>
    <div class="check-out-con wid990 clearfix">
        <img class="yindaotu" src="${webctx}/images/pay/yindaotu.png" alt="">
        <img class="erweima" src="${webctx}/images/pay/erweima.jpg" alt="">
    </div>
</div>
<%@ include file="/website/common/foot-site.jsp" %>

<script>
    $(".order-btn").click(function () {
        $(".order-detail-con").slideToggle();
        $(this).toggleClass("up-ico");
    })
</script>

</body>
</html>
